<%-- 
    Document   : newEditEmpleado
    Created on : 23/05/2014, 01:06:00 PM
    Author     : USUARIO
--%>

<%@page import="pas.beans.Pas_Cargo"%>
<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>AdminLTE | Dashboard</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="../../css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="../../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="../../css/ionicons.min.css" rel="stylesheet" type="text/css" />
        <!-- Theme style -->
        <link href="../../css/AdminLTE.css" rel="stylesheet" type="text/css" />
        
        <script>
            
            function eliminarCorreo(id){                
                $("#divCorreo").load("../../ServletEmpleado?accion=Correo", {id:id});                
            }
             function AgregarCorreo(){
                var cor_correo=$("#cor_correo").val();
                $("#divCorreo").load("../../ServletEmpleado?accion=Correo", {cor_correo:cor_correo});
                $("#cor_correo").val("");
             }
             
             function eliminarTelefono(id){                
                $("#divTelefono").load("../../ServletEmpleado?accion=Telefono", {id:id});                
             }
             function AgregarTelefono(){
                var id_telefono=$("#id_telefono").val();
                $("#divTelefono").load("../../ServletEmpleado?accion=Telefono", {id_telefono:id_telefono});
                $("#id_telefono").val("");
             }
            
        </script>
        

    </head>
    <body class="skin-blue">
        
        <%@include file="../../jspf/header.jspf" %>
        
        <div class="wrapper row-offcanvas row-offcanvas-left">
            
            <%@include file="../../jspf/menu.jspf" %>

            <!-- Right side column. Contains the navbar and content of the page -->
            <aside class="right-side">                
                <!-- Content Header (Page header) -->
                <section class="content-header">
                    <h1>
                        Empleados
                        <small>Mantenedor</small>
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
                        <li class="active">Empleados</li>
                    </ol>
                </section>

                <!-- Main content -->
                <section class="content">
                    <div class="row">
                        <!-- left column -->
                        <div class="col-md-12">
                            <!-- general form elements -->
                            <div class="box box-primary">
                                <div class="box-header">
                                    <h3 class="box-title">Registro Nuevo Empleado</h3>
                                </div><!-- /.box-header -->
                                <!-- form start -->
                                <form action="../../ServletEmpleado" role="form">
                                    <div class="box-body">
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <label>Nombre</label>
                                                <input type="text" class="form-control" placeholder="Nombres" name="per_nombre">
                                            </div>
                                            <div class="col-xs-4">
                                                <label>Apellido Paterno</label>
                                                <input type="text" class="form-control" placeholder="Apellido paterno" name="per_apepaterno">
                                            </div>
                                            <div class="col-xs-4">
                                                <label>Apellido Materno</label>
                                                <input type="text" class="form-control" placeholder="Apellido materno" name="per_apematerno">
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <label>DNI</label>
                                                <input type="text" class="form-control" placeholder="DNI" name="per_dni">
                                            </div>
                                            <div class="col-xs-4">
                                                <label>Dirección</label>
                                                <input type="text" class="form-control" placeholder="Dirección" name="per_direccion">
                                            </div>
                                            <div class="col-xs-4">
                                                <%
                                                ArrayList<Pas_Cargo> lista_cargo =Pas_Cargo.listarCargos();
                                                %>
                                                <label>Cargo</label>
                                                <select class="form-control" name="car_idcargo">
                                                    <% for(int k=0;k<lista_cargo.size();k++){%>
                                                    <option value="<%=lista_cargo.get(k).getIdCargo()%>"><%=lista_cargo.get(k).getNombre()%></option>
                                                    
                                                    <%}%>
                                                </select>
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <p><strong>Correo Electrónico</strong></p>
                                                <div class="input-group">
                                                    <input id="cor_correo" name="cor_correo" type="text" class="form-control"/>
                                                    <span class="input-group-btn">
                                                        <button type="button" class="btn btn-info btn-flat" onclick="AgregarCorreo();">Agregar</button>
                                                    </span>
                                                </div>                                                
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                            <div class="col-xs-6">
                                                <div id="divCorreo"></div>
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                            <div class="col-xs-4">
                                                <p><strong>Teléfonos</strong></p>
                                                <div class="input-group">
                                                    <input id="id_telefono" type="text" name="tel_numero" class="form-control"/>
                                                    <span class="input-group-btn">
                                                        <button type="button" class="btn btn-info btn-flat" onclick="AgregarTelefono()">Agregar</button>
                                                    </span>
                                                </div>                                                
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                            <div class="col-xs-6">
                                                <div id="divTelefono"></div>
                                            </div>
                                        </div><br/>
                                        <div class="row">
                                           <div class="col-xs-12">
                                                <div class="checkbox">
                                                    <label>
                                                        <input type="checkbox"/>
                                                        ¿Crear Usuario para este Empleado?
                                                    </label>                                                
                                                </div>
                                            </div>
                                        </div>
                                    </div><!-- /.box-body -->
                                    <div class="box-footer">
                                        <button type="submit" name="accion" value="I" class="btn btn-primary">Registrar</button>
                                        <a href="listEmpleado.jsp">
                                            <button type="button" class="btn btn-primary">Cancelar</button>
                                        </a>
                                    </div>
                                </form>
                            </div><!-- /.box -->
                        </div>
                    </div>
                </section><!-- /.content -->
            </aside><!-- /.right-side -->
        </div><!-- ./wrapper -->


        <!-- jQuery 2.0.2 -->
        <script src="../../js/jquery.min.js"></script>
        <!-- Bootstrap -->
        <script src="../../js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="../../js/app.js" type="text/javascript"></script>

    </body>
</html>
